<template>
  <a-sub-menu :key="menuInfo.path" @click.stop="subMenuClick(menuInfo)">
    <template #icon>
      <el-icon>
        <component :is="menuInfo.meta.icon" class="icon"></component>
      </el-icon>
    </template>
    <template #title>
      <span>{{menuInfo.meta.title}}</span>
    </template>
    <template v-for="item in menuInfo.children">
      <menu-sub :item="item" :keep-alive-list="keepAliveList"></menu-sub>
    </template>
  </a-sub-menu>
</template>
<script setup>
import {Menu} from "ant-design-vue";
import MenuSub from "@/components/menu/menuSub.vue";
import {getLVal} from "@utils/storage.js";
import useMenuStore from "@/store/modules/menu.js";
const keepAliveList = defineModel('keepAliveList')
const menu = useMenuStore()
const props = defineProps({
  ...Menu.SubMenu.props,
  menuInfo:{
    type:Object
  }
})
const subMenuClick = (menuInfo) => {
  const {path} = menuInfo
  let subList = getLVal('subList') || []
  if(menu.openKeysList.includes(path)){
    menu.subList = []
  }else{
    let result = subList.filter(item => item === path)
    menu.subList = result
  }
}
/**
 * 点击菜单项
 * @param item 被点击的菜单项
 */
</script>
<style scoped>

</style>
